<template>
  <panel title="流程列表">
    <a-card :bordered="false" size="small" :loading="loading">
      <div v-for="(item, index) in flowData" :key="index">
        <p class="dictName ml-3">{{ item.dictName }}</p>
        <lattice
          @click="jumpStartFlow(child.id)"
          v-for="(child, i) in item.data"
          :key="i"
          :titleName="child.title"
          :onlyOne="true"
          class="floatl"
          style="margin-left: 15px"
        ></lattice>

        <a-divider></a-divider>
      </div>
    </a-card>
  </panel>
</template>
<script>
  import { Getgroups } from '@/api/flow/api'
  import lattice from '@/plugins/lattice/lattice'
  export default {
    components: {
      lattice,
    },
    data() {
      return {
        flowData: [],
        loading: true,
      }
    },

    created() {
      this.getData()
    },
    methods: {
      getData() {
        Getgroups().then((res) => {
          console.log('res', res)
          if (res.isSuccess) {
            this.flowData = res.content
            this.loading = false
          } else {
            console.log('error', res)
            this.$message.error('请求出错了，请刷新重试')
          }
        })
      },

      // 发起流程
      jumpStartFlow(id) {
        this.$router
          .push({
            path: '/workbench/businessList',
            query: {
              id: id,
            },
          })
          .catch((err) => {
            console.log(err)
          })
      },
    },
  }
</script>
<style scoped>
  .dictName {
    margin-bottom: 10px;
    margin-left: 19px;
    font-size: 13px;
    color: grey;
  }
</style>
